<template>
    <div class="mobile-bind">
        <div v-if="sus">
           <div class="cPBoxItm-title">
               <div>绑定邮箱</div>
               <span class="c-recovery" @click="shut"></span>
           </div>
           <div class="setPublic-tipBox">
               <span class="setPublic-tipCont"></span>
               <span class="setPublic-tipWarning" v-if="showTip">
                <span class="setPublic-tipIcon"></span>
                <span class="setPublic-tipErr">{{tip}}</span>
            </span>
           </div>
           <div class="setPublic-phone">
               <div class="setPublic-phoneInput">
                   <span class="setPublic-phoneInputTip">输入邮箱</span>
                   <div class="setPublic-phoneInputBox">
                       <input class="setPublic-inputCont" v-model="emailNumber"/>
                   </div>
               </div>
               <div class="setPublic-next">
                   <div class="setPublic-nextOne" @click="determine">确定</div>
                   <div class="setPublic-nextClear">取消 </div>
               </div>
           </div>
        </div>
        <success v-if="!sus" v-on:shut="shut"></success>
    </div>
</template>
<script>
    var filter  = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    import success from './../public/success.vue';
    export default{
        data(){
            return{
                showTip:false,
                emailNumber:'',
                tip:'',
                sus:true
            }
        },
        methods:{
            shut:function () {
                this.$emit('close')
            },
            determine:function () {
                if(this.emailNumber!=''){
                    if(filter.test(this.emailNumber)){
                        $.ajax({
                            url:'/bindMail',
                            type:'post',
                            dataType:'json',
                            data:{
                                email:this.emailNumber
                            },
                            success:(data)=>{
                                if(data.opResult==0){
                                    this.sus=false;
                                }else if(data.opResult==1){
                                    this.tip='绑定失败！';
                                    this.showTip=true;
                                }else if(data.opResult==2){
                                    this.tip='新旧邮箱不能一致！';
                                    this.showTip=true;
                                }
                            }
                        })
                    }else{
                        this.tip='邮箱的格式错误！';
                        this.showTip=true;
                    }
                }else {
                    this.tip='邮箱不能为空！';
                    this.showTip=true;
                }
                setTimeout(()=>{
                    this.showTip=false;
                },1500)
            }
        },
        components:{
            success:success
        }
    }
</script>
<style scoped>
    .setPublic-next{
        margin-top:20px;
    }
</style>
